<template>
	<div>
		<i class="el-icon-edit-outline" @click="dialogVisible=true"></i>
		<div class="dialog">
			<el-dialog
				title="编辑属性"
				:visible.sync="dialogVisible">
				<el-form label-width="100px" label-position="left">
					<el-form-item label="产品名称">
						<el-input v-model="row.name"></el-input>
					</el-form-item>
					<el-form-item label="产品小标题">
						<el-input v-model="row.subTitle"></el-input>
					</el-form-item>
					<el-form-item label="原价格">
						<el-input v-model="row.originalPrice"></el-input>
					</el-form-item>
					<el-form-item label="优惠价格">
						<el-input v-model="row.promotePrice"></el-input>
					</el-form-item>
					<el-form-item label="库存">
						<el-input v-model="row.stock"></el-input>
					</el-form-item>
					<el-form-item>
						<el-button @click="commit()">提交</el-button>
					</el-form-item>
				</el-form>
			</el-dialog>
		</div>
	</div>
</template>

<script>
	import {editProduct} from '@/api/admin/product.js'
	export default{
		data() {
			return {
				dialogVisible:false
			}
		},
		props: {
			row: {
				type: Object
			},
		},
    methods: {
      commit() {
        // let formData = new FormData()
        // formData.append('name',this.row.name)
        // formData.append('id',this.row.id)
        // formData.append('subTitle',this.row.subTitle)
        // formData.append('originalPrice',this.row.originalPrice)
        // formData.append('promotePrice',this.row.promotePrice)
        // formData.append('stock',this.row.stock)
        // formData.append('category',this.$route.query.id)
		let data = {
			name:this.row.name,
			id:this.row.id,
			subTitle:this.row.subTitle,
			originalPrice:this.row.originalPrice,
			promotePrice:this.row.promotePrice,
			stock:this.row.stock,
			category:this.$route.query.id
		}
        editProduct(data).then(res => {
          if(res.code == 200){
            this.$message({
              type:'success',
              message:'编辑成功'
            })
            this.dialogVisible = false
            this.$emit('flash')
          }
		})
      }
    },
	}
</script>

<style scoped>
	.dialog{
		text-align: left;
	}
	i{
		font-size: 20px;
	}
	i:hover{
		color: #409EFF;
	}
</style>
